<!--点名记录-->
<template>
  <div class="app-container">
    <el-table v-loading="loading" :data="list" border :max-height="tableHeight">
      <el-table-column label="课程名称" align="center" prop="courseName" />
      <el-table-column label="班级名称" align="center" prop="className" />
       <el-table-column
          label="上课时间"
          show-overflow-tooltip
          :formatter="formatName"
          width="180"
           align="center"
        >
          <template #default="scope"
            ><div>{{ scope.row.classDate }}</div>
            {{ scope.row.classStartTime }}-{{ scope.row.classEndTime }}
          </template>
        </el-table-column>
      <el-table-column label="上课教室" align="center" prop="classRoomName" />
      <el-table-column label="上课老师" align="center" prop="teacherName" />
      <el-table-column label="上课内容" align="center" prop="description" />
      <!-- <el-table-column
        label="操作"
        align="center"
        width="140"
        class-name="small-padding fixed-width"
      >
        <template #default="scope">
          <el-button link type="primary" @click="handleDetail(scope.row)">
            查看点名详情
          </el-button>
        </template>
      </el-table-column> -->
    </el-table>
    <pagination
      v-show="total > 0"
      :total="total"
      v-model:page="queryParams.pageNum"
      v-model:limit="queryParams.pageSize"
      @pagination="getList"
      size="small"
    />
  </div>
</template>

<script setup>
import {
  getRollCallListAPI,
} from "@/api/registrar/class";

//接收学员ID
const route = useRoute()
const router = useRouter()
const studentsId = route.params.studentsId
const { proxy } = getCurrentInstance();
const { edu_teaching_mode } = proxy.useDict("edu_teaching_mode");

const loading = ref(false);
const total = ref(0);

const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
  },
});

const { queryParams } = toRefs(data);
const tHeight = window.innerHeight - 410;
const tableHeight = ref(tHeight > 0 ? tHeight : 50);

const list = ref([]);

// 方法------------------------------------------------------------------------------------------

function getList() {
  loading.value = true;
  getRollCallListAPI({ ...queryParams.value, listType: "4" ,studentId:studentsId}).then(
    (response) => {
      list.value = response.rows;
      total.value = response.total;
      loading.value = false;
    }
  );
}

// 调用-------------------------------------------------------------------------------------------------------------------
getList();
</script>

<style lang="scss" scoped>
.info {
  display: inline-flex;
  align-items: center;
  height: 32px;
}
</style>
